import "./index.less";
import { useLocation, useNavigate } from "react-router-dom";
import { PageHeader } from "@/components";
import { useEffect, useMemo, useState } from "react";
import { Form, Input, TextArea } from "antd-mobile";

interface initList {
  type: string;
  project: string;
}

export default function ServiceReport() {
  const navigate = useNavigate();
  const location = useLocation();
  const [form] = Form.useForm();
  const [ImageList, setImageList] = useState<any>([]);
  const [targetList, setTargetList] = useState();
  const [visible, setVisible] = useState(false);
  const [initList, setInitList] = useState<initList>();

  const ItemInfo = location?.state?.ItemInfo;

  const onFinish = async (values: any) => {};
  const Basic = useMemo(() => {
    return (
      <div>
        <div className="figImg">多添加图片，能更清晰的表明事件地点</div>
        {/* <ImageUploader
          maxCount={3}
          showUpload={ImageList.length < 3}
          value={ImageList}
          onChange={setImageList}
          upload={mockUpload}
          multiple={false}
          // maxCount={0}
          capture={true}
        /> */}
      </div>
    );
  }, [ImageList]);

  useEffect(() => {
    form.setFieldsValue(ItemInfo);
  }, []);

  return (
    <div className="sesr_contarnier">
      <div className="header-bg"></div>
      <PageHeader
        title="服务录入"
        goback={() => navigate("/publicService/entry")}
      />

      <div className="sesr_content">
        <Form form={form} onFinish={onFinish}>
          <Form.Item
            name="targetName"
            label="服务对象"
            rules={[{ required: true, message: "必填项" }]}
          >
            <Input
              placeholder="请选择"
              onFocus={() =>
                navigate(`/publicService/entry/character`, {
                  state: {
                    ItemInfo: { ...ItemInfo },
                  },
                })
              }
            />
          </Form.Item>

          <Form.Item name="type" label="服务类型">
            <Input />
          </Form.Item>
          <Form.Item name="project" label="服务项目">
            <Input />
          </Form.Item>

          <Form.Item name="content" label="服务描述" className="eventContent">
            <TextArea placeholder="请输入事件描述" rows={4} />
          </Form.Item>

          <Form.Item label="照片" className="BasicBox">
            {Basic}
          </Form.Item>

          <Form.Item name="evaluateContent" label="发表评价">
            <Input
              placeholder="去评价"
              onFocus={() =>
                navigate(`/publicService/entry/evaluate`, {
                  state: { ItemInfo: ItemInfo },
                })
              }
            />
          </Form.Item>
        </Form>
      </div>
    </div>
  );
}
